var SearchBtn = function () {
  var template = /* html */ `
    <div class="el-button search-btn">
      <el-button :class="{'non-radius':!hasRadius}" size="small" @click="searchData">搜索</el-button>
      
      <el-dialog append-to-body title="搜索条件" :visible.sync="openSearch" top="0px" width="100%" :show-close="false">
        <div class="boardsearchForm">
          <div class="search-content" label-width="100px">
            <el-form :model="search">
              <el-form-item label="部门-车间">
                <el-cascader clearable filterable class="search-input" v-model="search.deptWorkshop" placeholder="请选择部门-车间" :options="deptWorkshopList"
                  separator="-" :props="deptWorkshopProps"></el-cascader>
              </el-form-item>
            </el-form>
          </div>
          <div style="text-align:center">
            <el-button type="primary" size="medium" @click="searchBtnClick">搜索</el-button>
          </div>
        </div>
      </el-dialog>
    </div>
  `;

  return {
    props: {
      machineSearch: {
        type: Object,
        required: true
      },
      machineList: {
        type: Array,
        default: function () {
          return [];
        }
      },
      hasRadius: {
        type: Boolean,
        default: true
      }
    },

    watch: {
      machineList: function () {
        this.setDeptWorkshopList();
      }
    },

    data: function () {
      return {
        openSearch: false,
        search: new SearchModel(),
        deptWorkshopList: [],
        deptWorkshopProps: {
          value: "id",
          label: "name",
          children: "workshops",
          checkStrictly: true
        }
      };
    },

    created: function () {
      this.setDeptWorkshopList();
    },

    methods: {
      setDeptWorkshopList: function () {
        var machineList = this.machineList;
        var len = machineList.length;
        var deptWorkshopMap = {};
        for (var i = 0; i < len; i++) {
          var machine = machineList[i];
          var deptId = machine.deptId;
          var deptWorkshop = deptWorkshopMap[deptId];
          if (deptWorkshop === undefined) {
            deptWorkshop = {
              id: deptId,
              name: machine.deptName,
              workshops: []
            };
            deptWorkshopMap[deptId] = deptWorkshop;
          }

          deptWorkshop.workshops.push({
            id: machine.workShopId,
            name: machine.workShopName
          });
        }

        var deptWorkshopList = [];
        for (var deptId in deptWorkshopMap) {
          var deptWorkshop = deptWorkshopMap[deptId];
          deptWorkshop.workshops = _.uniqBy(deptWorkshop.workshops, 'id');
          deptWorkshopList.push(deptWorkshop);
        }
        this.deptWorkshopList = deptWorkshopList;
      },

      searchData: function () {
        this.search.resetObject();
        this.openSearch = true;
      },

      searchBtnClick: function () {
        this.openSearch = false;
        this.search.saveObject();
        this.$emit('search-data', this.getSearchObject());
      },

      getSearchObject: function () {
        return this.search.getObject();
      }
    },

    template: template
  };
}();
